<template>
	<view>
		<banner :ad-list="adList" h=216.5></banner>
		<view class="account">
			
			
			<input class="mobile" type="text" v-model="mobile" placeholder="请输入呼叫号码" />
			
			<view class="keyboard ">
				<view class="title">
					<navigator url="contact">联系人</navigator>
					<navigator url="list">通话记录</navigator>
				</view>
				<view class="number-box">
					<view class="item" @tap="inputNumber(1)">1</view>
					<view class="item" @tap="inputNumber(2)">2</view>
					<view class="item" @tap="inputNumber(3)">3</view>
					<view class="item" @tap="inputNumber(4)">4</view>
					<view class="item" @tap="inputNumber(5)">5</view>
					<view class="item" @tap="inputNumber(6)">6</view>
					<view class="item" @tap="inputNumber(7)">7</view>
					<view class="item" @tap="inputNumber(8)">8</view>
					<view class="item" @tap="inputNumber(9)">9</view>
					<view class="item" @tap="inputNumber(0)">0</view>
					<view class="item" @tap="callPhone"><text class="icon iconfont icon-dianhua text-success"></text></view>
					<view class="item" @tap="delNumber"><text class="icon iconfont icon-huitui"></text></view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import Request from '../../common/request.js';
	import banner from '../../components/banner.vue';
	import {
		priceName, appName
	} from '../../common/config.js';
	export default {
		components: {
			banner
		},
		data() {
			return {
				mobile: '',
				adList: []
			};
		},
		onLoad(e) {
			
			var token = uni.getStorageSync('token');
			console.log('index data');
			console.log(e);
			if(e.rUserId) {
				uni.setStorageSync('recommendId', e.rUserId)
			}
			if(!token) {
				// #ifdef MP-WEIXIN
					uni.reLaunch({
						url: '/pages/my/auth'
					})
				// #endif
				
				// #ifndef MP-WEIXIN
					uni.reLaunch({
						url: '/pages/my/login'
					})
				// #endif
				
				return;
			}
			
			this.getAd();
		},
		onShareAppMessage() {
			var userinfo = uni.getStorageSync('userinfo');
			Request.send({
				url: 'share/addRecord',
				data: {
					type: 1
				},
				checkCode: false
			})
			
			return {
				title: appName,
				path: '/pages/call/index?rUserId='+userinfo.id,
				imageUrl: '/static/icon/share.png'
			}
		},
		methods: {
			//获取广告
			getAd() {
				var that = this;
				Request.send({
					url: 'call/ad',
					sCallback: function(res) {
						that.adList = res.data;
					}
				});
			},
				//输入号码
				inputNumber: function(n) {
					var mobile = String(this.mobile);
					if(mobile.length < 11) {
						this.mobile = mobile+n;
					}
				},

				//拨打电话
				callPhone: function(){
					var mobile = this.mobile;
					if(!mobile) {
						Request.alert('请手机号码');return;
					}

					var preg = /^1\d{10}$/;
					if(!preg.test(mobile)) {
						Request.alert('手机号码格式不正确');return;
					}
					var url =  'call/dial';
					var that = this;
					Request.send({
						url: url,
						data: {callee: mobile},
						sCallback: function(res) {
							Request.alert(res.msg);
						}
					})

				},

				//删除号码
				delNumber: function(){
					var mobile = String(this.mobile);
					this.mobile = mobile.substr(0, mobile.length-1);
				},

				login:function(){
					location.href = '/mobile/user/login';
				}
			}
	}
</script>

<style>
		page, .mui-content{
			/* background: #1F4B5F; */
			/* color: #B2B3B4; */
			font-size: 28upx;
		}

		.account{
			padding-top:30upx;
		}

		.account .tips{
			text-align: center;
		}

		.account .mobile{
			text-align: center;
			font-size: 50upx;
			/* color: #fff; */
			
		}


		.keyboard{
			position: fixed;
			bottom: 0;
			left: 0;
			width: 100%;
			z-index: 999;
			/* background: #081F3F; */
			/* color: #B2B3B4; */
		}
		
		/* #ifdef H5 */
			.keyboard{
				bottom: 50px;
			}
		/* #endif */

		.keyboard .title{
			text-align: center;
			line-height: 80upx;
			display: flex;
			justify-content: center;
			border-top: 1upx solid #eee;
			border-bottom: 1upx solid #eee;
		}

		.keyboard .title navigator{
			flex: 1;
			display: block;
			color: #FD0136l
		}

		.keyboard .number-box{
			display: flex;
			flex-wrap: wrap;
			/* border-top: 1upx solid #ccc; */
			
			justify-content: center;
						
			
		}

		.keyboard .item{
			width: 250upx;
			text-align: center;
			font-size: 60upx;
			line-height: 100upx;
			/* border-right: 1upx solid #ccc; */
			/* border-bottom: 1upx solid #ccc; */
			color: rgba(0,0,0,0.7);
			color: #333;
			box-sizing: border-box;
		}

		.keyboard .item .icon{
			font-size: 60upx;
		}

		.keyboard .item .icon-dianhua{
			font-size: 80upx;
		}
		
</style>
